<template>
  <div>
    <tr v-for="(item, index) in list" :key="index">
      <td><input v-model="item.checked" type="checkbox" /></td>
      <td>{{ item.name }}</td>
      <td>{{ item.price }}</td>
      <td>
        <button @click="subFn(index)">-</button>
        {{ item.num }}
        <button @click="addFn(index)">+</button>
      </td>
      <td>{{ item.price * item.num }}</td>
      <td><button @click="delFn(index)">删除</button></td>
    </tr>
  </div>
</template>

<script>
export default {
  props: ["list"],
  methods:{
    subFn(index){
     this.$emit('sub',index,1)
    },
    addFn(index){
       this.$emit('add',index,1)
    },
    delFn(index){
      this.$emit('del',index)
      
    }
  }

};
</script>

<style scoped>
td {
  width: 700px;
  border: 1px solid #000;
  text-align: center;
}
</style>
